<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="format-detection" content="telephone=no" />
	<title>友好生鲜</title>
	<link rel="stylesheet" href="css/base.css">
	<link rel="stylesheet" href="css/group.css">
	<script type="text/javascript" src="js/zepto.js"></script>
	<script type="text/javascript" src="js/banner.js"></script>
</head>
<body>
<!--首页头部-->
<div class="header_body">
	<div class="header_main">
		<div class="header_icon01"><a href="group.jsp"></a></div>
		<div class="header_txt">友好生鲜</div>
		<div class="header_icon02"><a href="#1"></a></div>
	</div>
</div>
<!--内容-->
<div class="gro_det_txm" style="background-image:url(img/group/detail_bj.png)">
	<a href="details_people.jsp">
		<div class="gro_det_txi" style="background-image:url(img/my/tx.png)"></div>
		<div class="gro_det_txn"><p>优选师：Gaga</p></div>
	</a>
</div>
<!--tab-->
<div class="gro_det_tabs">
	<!--导航-->
	<ul class="gro_det_tabs_ul" id="tab_tit_ul">
		<li class="gro_det_tabs_li gro_det_tabs_li_now">好东西<i></i></li>
		<li class="gro_det_tabs_li">详情<i></i></li>
		<li class="gro_det_tabs_li">已购买<i></i></li>
	</ul>
	<!--切换内容-->
	<div class="gro_det_tabs_list" id="tab_lists">
		<div class="tab_lists_t gro_det_tabs_t1">
			<!--轮播-->
			<div class="wrap" id="focus">
				<ul class="pics">
					<li style="background-image:url(img/banner.png)"><a href="#1"></a></li>
					<li style="background-image:url(img/banner.png)"><a href="#2"></a></li>
					<li style="background-image:url(img/banner.png)"><a href="#3"></a></li>
				</ul>
				 <p class="num">
					<i class="dot current"></i>
					<i class="dot"></i>
					<i class="dot"></i>
				</p>
				<script type="text/javascript">
					window.addEventListener('DOMContentLoaded', function(){ 
					var $slide = document.getElementById('focus');
					var aBullet = $slide.querySelectorAll('.dot');
					var len = aBullet.length;
					
					var mySwipe = new Swipe($slide,{
					auto: 4000,
						callback: function(i){
							var n = len 
						while(n--) {
								aBullet[n].classList.remove('current');
							}
							aBullet[i].classList.add('current');
						}
					});
					});
				</script>
			</div>
			<!--详情-->
			<div class="tabs_t1_txts">
				<div class="tabs_t1_txts_main">
					<p>海南当季新鲜水果批发非广西越南红心火龙果 应季火龙果富含花青素 新鲜水果</p>
					<div class="tabs_t1_money">拼团价：<span>¥34.2</span>原价：<span>¥66</span><a class="fenxiang"></a></div>
					<span>已团234件•20人拼团</span>
					<a><p>拼团剩余时间</p><span>02天23时10分4秒</span></a>
					<div class="tabs_t1_shuomin">拼团结束后24小时内发货</div>
					<!--分享弹框-->
					<div class="fenxiang_body" style="display:none">
						<div class="fenxiang_main">
							<ul>
								<li><a><span class="fenxiang_icon01"></span>微信好友</a></li>
								<li><a><span class="fenxiang_icon02"></span>朋友圈</a></li>
								<li><a href="share.jsp"><span class="fenxiang_icon03"></span>发现</a></li>
							</ul>
							<div class="fenxiang_button"><a id="qxfx">取消分享</a></div>
						</div>
						<script type="text/javascript">
							$(document).ready(function(){
							$('.fenxiang').click(function(){
								$('.fenxiang_body').show();
								});
							$('#qxfx').click(function(){
								$('.fenxiang_body').hide();
								});
							});
						</script>
					</div>
				</div>
			</div>
			<!--商品规格-->
			<div class="tabs_t1_spec" onClick="toshare2()"><a href="#1">商品规格</a></div>
			<!--商品详情-->
			<div class="tabs_t1_details_mian">
				<div class="t1_details_tit">商品详情<i></i></div>
				<p>火龙果为热带、亚热带水果，喜光耐阴耐热耐旱 在中国只要集中在海南、广西、广东一带。这里 暖湿润，光照充足，十分适宜火龙果的是生</p>
				<p><img src="img/group/group_img.jpg"></p>
				<p>火龙果为热带、亚热带水果，喜光耐阴耐热耐旱 在中国只要集中在海南、广西、广东一带。这里 暖湿润，光照充足，十分适宜火龙果的是生</p>
				<div class="t1_details_butt"><a href="#1"><span>查看详细介绍</span></a></div>
			</div>
			<!--售后-->
			<div class="tabs_t1_details_mian t1_details_tit_dian">
				<div class="t1_details_tit">配送、售后及其他说明<i></i></div>
				<p>快递信息：UU跑腿；</p> 
				<p>配送范围：仅限郑州市；</p>
				<p>发货时间：下单后1小时极速送达，遇到节假日 会有相应调整；</p>
				<p>退货须知：收到商品后如有质量问题，请及时 联系客服人员；</p>
				<p>退货须知：收到商品后如有质量问题，请及时 联系客服人员；</p>
				<div class="t1_details_butt2"><a href="#1"><span>需要帮助</span></a></div>
			</div>
			<!--会员评价-->
			<div class="tabs_t1_details_mian">
				<div class="t1_details_tit">会员评价<i></i></div>
				<!--list-->
				<div class="find_list_main">
					<!--4张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_4">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_no">有用</a></div>
						</div>
					</div>
					<!--2到3张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_3">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_yes">取消</a></div>
						</div>
					</div>
					<!--1张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_1">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_no">有用</a></div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="tab_lists_t gro_det_tabs_t2 tab_hid">
			<!--商品详情-->
			<div class="tabs_t1_details_mian">
				<div class="t1_details_tit"></div>
				<p>火龙果为热带、亚热带水果，喜光耐阴耐热耐旱 在中国只要集中在海南、广西、广东一带。这里 暖湿润，光照充足，十分适宜火龙果的是生</p>
				<p><img src="img/group/group_img.jpg"></p>
				<p>火龙果为热带、亚热带水果，喜光耐阴耐热耐旱 在中国只要集中在海南、广西、广东一带。这里 暖湿润，光照充足，十分适宜火龙果的是生</p>
				<p><img src="img/group/group_img2.jpg"></p>
				<p><img src="img/group/group_img3.jpg"></p>
			</div>
		</div>
		<div class="tab_lists_t gro_det_tabs_t3 tab_hid">
			<!--会员评价-->
			<div class="tabs_t1_details_mian">
				<!--list-->
				<div class="find_list_main">
					<!--4张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_4">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_no">有用</a></div>
						</div>
					</div>
					<!--2到3张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_3">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_yes">取消</a></div>
						</div>
					</div>
					<!--1张图片的时候-->
					<div class="find_list">
						<div class="find_list_tit">
							<div class="find_list_tit_img" style="background-image:url(img/banner.png)"></div>
							<div class="find_list_tit_txt"><p>爱吃水果的小小胖</p><span>2017-08-12  10:32</span></div>
						</div>
						<div class="find_list_txt">
							<p>不错和图片一样，价格实惠，火龙果个头大而且很新鲜，吃着也非常甜。这个真的是买到赚到，强烈推荐哦～</p>
						</div>
						<div class="find_list_img find_list_img_1">
							<ul>
								<li><a style="background-image:url(img/banner.png)"></a></li>
							</ul>
							<span>5袋装／169g／袋</span>
						</div>
						<div class="find_list_but">
							<div class="find_list_but_left"><span>324</span>人认为有用</div>
							<div class="find_list_but_right"><a href="#1" class="zhan_no">有用</a></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script>
	$(function(){
		 /*切换*/
		 $("#tab_tit_ul li").bind("click",function(){
				 $(this).addClass("gro_det_tabs_li_now").siblings().removeClass("gro_det_tabs_li_now");
				 $('#tab_lists .tab_lists_t').eq($(this).index()).show().siblings().hide();
		 });
	})
	</script>
	<!--底部按钮-->
	<div class="group_botm_but">
		<div class="group_botm_but_01"><a href="#1"></a></div>
		<div class="group_botm_but_04"><a>已售罄</a></div>
	</div>
</div>
<!--一键拼团-->
<div class="am-share2">
	<div class="am_share_img2" style="background-image: url(img/banner.png)"></div>
	<div class="am_share_txt2"><p>¥ 89/500g</p><span>库存：3268件</span></div>
  <button class="share_btn2"></button>
	<!--规格-->
	<div class="am_share_guige2">
		<p>商品规格</p>
		<ul class="am_share_guige_ul2">
			<li class="am_share_guige_liin2 am_share_guige_linow2">5袋装／169g／袋</li>
		</ul>
		<script type="text/javascript">
		$(document).ready(function(e) {
				$(".am_share_guige_ul2 li").click(function(){
				$(this).addClass("am_share_guige_linow2").siblings().removeClass("am_share_guige_linow2");
				});
		});
		</script>
	</div>
	<!--数量-->
	<div class="am_share_shuliang2">
		<p>商品数量</p>
		<div id="shuliang2" class="spinner2">
			<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
			<script type="text/javascript" src="js/jquery.spinner.js"></script>
			<script type="text/javascript">
			$(function(){
				$("#shuliang2").Spinner();
			});
			</script>
		</div>
	</div>
	<!--按钮-->
	<div class="am_share_button_main am_share_button_main2">
		<ul>
			<li><a href="#1" class="am_share_button03">已售罄</a></li>
		</ul>
	</div>
</div>
<script type="text/javascript">
	function toshare2(){
		$(".am-share2").addClass("am-modal-active2");	
		if($(".sharebg2").length>0){
			$(".sharebg2").addClass("sharebg-active2");
		}else{
			$("body").append('<div class="sharebg2"></div>');
			$(".sharebg2").addClass("sharebg-active2");
		}
		$(".sharebg-active2,.share_btn2").click(function(){
			$(".am-share2").removeClass("am-modal-active2");	
			setTimeout(function(){
				$(".sharebg-active2").removeClass("sharebg-active2");	
				$(".sharebg2").remove();	
			},300);
		})
	}	
</script>

</body>
</html>
